<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Login</title>
	<style>
		* {
			margin: 0;
			padding: 0;
		}

		body {
			height: 100vh;
			background: linear-gradient(#b2d2ec, #dae6f0);
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 16px;
			color: #212431;
		}

		.login {
			width: 400px;
			height: 500px;
			background: bisque;
			border-radius: 13px;
		}

		h2 {
			text-align: center;
			font-size: 40px;
		}

		.item {
			padding-top: 20px;
			position: relative;
		}

		.item label {
			position: absolute;
			left: 0;
			top: 20px;
			transition: all 0.5s linear;
		}
	</style>
</head>
<body>
	<div class="login">
		<h2>Login</h2>
		<form action="" method="post">
			<div class="item">
				<input type="text" name="user">
				<label for="">User</label>
			</div>
			<div class="item">
				<input type="password" name="password" id="">
				<label for="">Password</label>
			</div>
			<button>Submit</button>
		</form>
	</div>
</body>
</html>